<template>
    <div class="topNav">
        <div class="topleft">
           <van-icon name="wap-nav" class="wapnav"/>
        </div>
        <div class="topContent">
            <span @click="$router.push('/infouser')">我的</span>
            <span class="active">发现</span>
            <span>云村</span>
            <span>视频</span>
        </div>
        <div class="topRight">
                                         <!-- 路由跳转 -->
            <van-icon name="search"  @click="$router.push('/search')"/>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            methods:{
                
            }
        }
    }
}
</script>
<style lang="less" scoped>
.topNav{
    width: 100%;
    height: 1rem;
    display: flex;
    justify-content: center;
    padding: .2rem;
}
.topleft{
    width: 15%;
    display: flex;
    justify-content: center;
    .van-icon{
        font-size: .5rem;
    }
}
.topContent{
    width: 70%;
    height: 100%;
    display: flex;
    justify-content: space-around;    
    font-size: .36rem;
    .active{
        font-weight: 900;
    }
   
}

.topRight{
    width: 15%;
    display: flex;
    justify-content: center;
    .van-icon{
        font-size: .5rem;
    }
}
</style>